<template>
	<div class="sms-pluginSmsLog-edit">
		<!-- 添加或修改短信日志对话框 -->
		<el-dialog v-model="isShowDialog" width="800px" :close-on-click-modal="false" :destroy-on-close="true">
			<template #header>
				<div v-drag="['.sms-pluginSmsLog-edit .el-dialog', '.sms-pluginSmsLog-edit .el-dialog__header']">
					{{ (!formData.id || formData.id == 0 ? '添加' : '修改') + '短信日志' }}
				</div>
			</template>
			<el-form ref="formRef" :model="formData" :rules="rules" label-width="120px">
				<el-form-item label="短信平台的类型" prop="smsType">
					<el-select v-model="formData.smsType" placeholder="请选择短信平台的类型">
						<el-option v-for="dict in sms_platform_type" :key="dict.value" :label="dict.label" :value="dict.value" />
					</el-select>
				</el-form-item>
				<el-form-item label="短信的类型" prop="msgType">
					<el-select v-model="formData.msgType" placeholder="请选择短信的类型">
						<el-option v-for="dict in sms_type" :key="dict.value" :label="dict.label" :value="dict.value" />
					</el-select>
				</el-form-item>
				<el-form-item label="模板id" prop="templateid">
					<el-input v-model="formData.templateid" placeholder="请输入模板id" />
				</el-form-item>
				<el-form-item label="电话号码" prop="mobiles">
					<el-input v-model="formData.mobiles" placeholder="请输入电话号码" />
				</el-form-item>
				<el-form-item label="模板参数" prop="params">
					<el-input v-model="formData.params" placeholder="请输入模板参数" />
				</el-form-item>
				<el-form-item label="发送结果" prop="result">
					<el-input v-model="formData.result" placeholder="请输入发送结果" />
				</el-form-item>
			</el-form>
			<template #footer>
				<div class="dialog-footer">
					<el-button type="primary" @click="onSubmit" :disabled="loading">确 定</el-button>
					<el-button @click="onCancel">取 消</el-button>
				</div>
			</template>
		</el-dialog>
	</div>
</template>
<script lang="ts">
import { reactive, toRefs, defineComponent, ref, unref, getCurrentInstance } from 'vue';
import { ElMessageBox, ElMessage, FormInstance, UploadProps } from 'element-plus';
import {
	listPluginSmsLog,
	getPluginSmsLog,
	delPluginSmsLog,
	addPluginSmsLog,
	updatePluginSmsLog,
	sendVerify,
	sendContent,
	sendCheckVerify,
} from '/@/api/system/sms/pluginSmsLog';
import {
	PluginSmsLogTableColumns,
	PluginSmsLogInfoData,
	PluginSmsLogTableDataState,
	PluginSmsLogEditState,
} from '/@/views/system/sms/pluginSmsLog/list/component/model';
export default defineComponent({
	name: 'ApiV1PluginsSmsPluginSmsLogEdit',
	components: {},
	props: {},
	setup(props, { emit }) {
		const { proxy } = <any>getCurrentInstance();
		const formRef = ref<HTMLElement | null>(null);
		const menuRef = ref();
		const state = reactive<PluginSmsLogEditState>({
			loading: false,
			isShowDialog: false,
			formData: {
				id: undefined,
				smsType: undefined,
				msgType: undefined,
				templateid: undefined,
				mobiles: undefined,
				params: undefined,
				result: undefined,
				createdAt: undefined,
				updatedAt: undefined,
				deletedAt: undefined,
			},
			// 表单校验
			rules: {
				id: [{ required: true, message: 'ID不能为空', trigger: 'blur' }],
			},
		});
		// 打开弹窗
		const openDialog = (row?: PluginSmsLogInfoData) => {
			resetForm();
			if (row) {
				getPluginSmsLog(row.id!).then((res: any) => {
					const data = res.data;
					data.smsType = '' + data.smsType;
					data.msgType = '' + data.msgType;
					state.formData = data;
				});
			}
			state.isShowDialog = true;
		};
		// 关闭弹窗
		const closeDialog = () => {
			state.isShowDialog = false;
		};
		// 取消
		const onCancel = () => {
			closeDialog();
		};
		const sendVerifyFun = () => {
			const formWrap = unref(formRef) as any;
			if (!formWrap) return;
			formWrap.validate((valid: boolean) => {
				if (valid) {
					state.loading = true;
					sendVerify(state.formData)
						.then(() => {
							ElMessage.success('发送成功');
						})
						.finally(() => {
							state.loading = false;
						});
				}
			});
		};
		const sendContentFun = () => {
			const formWrap = unref(formRef) as any;
			if (!formWrap) return;
			formWrap.validate((valid: boolean) => {
				if (valid) {
					state.loading = true;
					sendContent(state.formData)
						.then(() => {
							ElMessage.success('发送成功');
						})
						.finally(() => {
							state.loading = false;
						});
				}
			});
		};
		const sendCheckVerifyFun = () => {
			const formWrap = unref(formRef) as any;
			if (!formWrap) return;
			formWrap.validate((valid: boolean) => {
				if (valid) {
					state.loading = true;
					sendCheckVerify(state.formData)
						.then(() => {
							ElMessage.success('发送成功');
con
							if (formData.msgType == 'SendVerifyCode') {
								sendVerifyFun();
							} else if (formData.msgType == 'SendContent') {
								sendContentFun();
							} else if (formData.msgType == 'SendCheckVerify') {
								sendCheckVerifyFun();
							}
						})
						.finally(() => {
							state.loading = false;
						});
				}
			});
		};

		// 提交
		const onSubmit = () => {
			const formWrap = unref(formRef) as any;
			if (!formWrap) return;
			formWrap.validate((valid: boolean) => {
				if (valid) {
					state.loading = true;
					if (!state.formData.id || state.formData.id === 0) {
						//添加
						addPluginSmsLog(state.formData)
							.then(() => {
								ElMessage.success('添加成功');
								closeDialog(); // 关闭弹窗
								emit('pluginSmsLogList');
							})
							.finally(() => {
								state.loading = false;
							});
					} else {
						//修改
						updatePluginSmsLog(state.formData)
							.then(() => {
								ElMessage.success('修改成功');
								closeDialog(); // 关闭弹窗
								emit('pluginSmsLogList');
							})
							.finally(() => {
								state.loading = false;
							});
					}
				}
			});
		};
		const resetForm = () => {
			state.formData = {
				id: undefined,
				smsType: undefined,
				msgType: undefined,
				templateid: undefined,
				mobiles: undefined,
				params: undefined,
				result: undefined,
				createdAt: undefined,
				updatedAt: undefined,
				deletedAt: undefined,
			};
		};
		// 字典选项数据
		const { sms_type } = proxy.useDict('sms_type');

		const { sms_platform_type } = proxy.useDict('sms_platform_type');
		return {
			proxy,
			openDialog,
			closeDialog,
			onCancel,
			sms_platform_type,
			sms_type,
			onSubmit,
			menuRef,
			formRef,
			...toRefs(state),
		};
	},
});
</script>
<style scoped>
.kv-label {
	margin-bottom: 15px;
	font-size: 14px;
}
.mini-btn i.el-icon {
	margin: unset;
}
.kv-row {
	margin-bottom: 12px;
}
</style>